@import '../../button/style/mixins';

@include b(confirm) {
  @include b(modal) {
    @include e(body) {
      text-align: center;
    }
    @include e(footer) {
      padding: 0;
    }
  }

  @include b(popup) {
    position: relative;
    background-color: var(--modal-background);
    box-shadow: 0 r(7) r(21) var(--color-shadow);
    overflow: hidden;
  }

  @include e(button) {
    display: block;
    position: relative;
    width: 100%;
    @include button-base();
    @include button-size(
      var(--button-height-lg),
      var(--button-padding-h-lg),
      var(--button-font-size-lg),
      var(--button-icon-size-lg),
    );
    @include onepx(top);

    background-color: var(--confirm-button-background);

    &:active {
      background-color: var(--confirm-button-active-background);
    }

    &:not(:first-of-type) {
      @include onepx(left top);
    }

    @include m(ok) {
      color: var(--theme-primary);
    }
  }

  @include m(radius) {
    @include b(popup) {
      border-radius: var(--radius-md);
    }
  }
}
